<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link rel="shortcut icon" href="favicon.ico" />
    	<link href="../../css/bootstrap.min14ed.css" rel="stylesheet" /> 
    <link href="../../css/font-awesome.min93e3.css" rel="stylesheet" />
    <link href="../../css/animate.min.css" rel="stylesheet" />
    <link href="../../css/style.min862f.css" rel="stylesheet" />
    <link rel="stylesheet" href="../../css/custom.css" />
</head>
<body>
	<div class="wrapper animated fadeIn">
		<div class="top-tool row">
			<form action="" class="form-inline"  style="padding-top: 4px;">
				<div class="form-group">
					<label>产品名称:</label>
					<input type="text" name="" class="form-control input-sm"  />
				</div>
				<div class="form-group">
					<label>产品类型:</label>
					<select name="" class="form-control input-sm">
						<option value="all">全部</option>
						<option value="1">器材租赁</option>
					</select>
				</div>
				<div class="form-group">
					<label>商家名称:</label>
					<input type="text" name="" class="form-control input-sm" />
				</div>
				<div class="form-group">
					<label>服务地区:</label>
					<select name="" class="form-control input-sm">
						<option value="0">--全部--</option>
						<option value="1">深圳</option>
					</select>
				</div>
				<div class="form-group">
					<button type="submit" class="btn btn-primary btn-sm">搜索</button>
					<button type="button" class="btn btn-warning btn-sm" onclick="location.href=location.origin + location.pathname">清空搜索</button>
				</div>
				
			</form>
		</div>
		<table class="table table-hover table-striped" style="margin-top: 15px;">
			<thead>
				<tr>
					<th>服务名称</th>
					<th>商家</th>
					<th>服务地区</th>
					<th>格价</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				<tr data-id="213" data-ourl="https://app.yingplus.com.cn/Public/uploads/photo/20170405/58e4aa9b19c06.jpg">
					<td >
						ARRI 艾丽莎 XT 套装
					</td>
					<td>
						深圳市濉影影视器材有限公司
					</td>
					<td>
						深圳,中山,珠海,广州,汕头
					</td>
					<td>
						<span class="text-danger">&yen; 1288</span>
						<p><span class="label label-primary">多套餐</span></p>
					</td>
					<td>
						<!--有套餐添加 a-->
						<!--<button type="button" class="btn btn-primary bnt-sm moreSpec">添加</button>-->
						<a type="button" data-toggle="modal" href="remote.html?gid=213" data-target="#myModal" class="btn btn-primary bnt-sm">添加</a>
					</td>
				</tr>
				<tr data-id="214" data-ourl="https://app.yingplus.com.cn/Public/uploads/photo/20170405/58e4aa9b19c06.jpg">
					<td >
						ARRI 艾丽莎 XT 套装
					</td>
					<td>
						深圳市濉影影视器材有限公司
					</td>
					<td>
						深圳,中山,珠海,广州,汕头
					</td>
					<td>
						<span class="text-danger">&yen; 1288</span>
					</td>
					<td>
						<!--无套餐 添加 joinCart-->
						<button type="button" class="btn btn-primary bnt-sm joinCart">添加</button>
					</td>
				</tr>
			</tbody>
		</table>
		<div class="text-right">
			<div class="btn-group">
                <a class="btn btn-white"><i class="fa fa-chevron-left"></i></a>
                <a class="btn btn-white active">1</a>
                <a class="btn btn-white  ">2</a>
                <a class="btn btn-white">3</a>
                <a class="btn btn-white">4</a>
                <a type="button" class="btn btn-white"><i class="fa fa-chevron-right"></i>
                </a>
            </div>
		</div>
	</div>

 <div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content animated fadeInDown">
        </div>
    </div>


<script src="../../js/jquery.min.js"></script>
<script src="../../js/bootstrap.min.js"></script>
<script src="../../js/plugins/layer/layer.min.js"></script>
<script src="../../js/content.min.js"></script>
<!--自定义-->
<!--<script src="../../js/config.js"></script>-->
<script type="text/javascript">
	$('table tbody tr').hover(function(){
		var ourl = $(this).data('ourl');
		this.layer = layer.tips('<img src="'+ourl+'" height="120px" alt="" />', $(this), {
		    tips: [1],
		    time: 4000
		});
	}, function(){
		layer.close(this.layer);
	});
	//有套餐添加
	$('body').on('click', '.saveSpec', function(){
		var  mbody = $(this).parents('.modal-content');
		var gid = $(this).data('id'),
			name = mbody.find('.modal-header .modal-title').text();
		var radios = mbody.find('.modal-body input');
		var spec = {},price = 0;
		radios.each(function(){
			if( this.checked  ){
				spec['pid'] = this.value;
				spec['name'] = $.trim($(this).parents('tr').find('td:eq(1)').text());
				spec['content'] = $.trim($(this).parents('tr').find('td:eq(2)').text());
				price = $.trim($(this).parents('tr').find('td:eq(3)').text()).split(' ')[1];
			}
		});
		parent.joinCart({gid:gid, name:name,price:price, spec:spec});
		$('#myModal').modal('hide')
	});
	//无套餐添加
	$('.joinCart').click(function(){
		var otr = $(this).parents('tr');
		var gid = otr.data('id'),
			name = $.trim(otr.find('td:eq(0)').text());
		var price = $.trim(otr.find('.text-danger').text()).split(' ')[1];
		parent.joinCart({gid:gid, name:name, price:price});
	});
	
</script>
</body>
</html>
